import { Tabbar } from 'react-vant'
import { createFromIconfontCN } from '@react-vant/icons'
import { useNavigate } from 'react-router-dom'

export default function AppTabbar() {
    const MyIcon = createFromIconfontCN('//at.alicdn.com/t/c/font_4178253_7rtd0b1r9mx.js')
    const navigate = useNavigate()
    return (
        <div className='demo-tabbar'>
            <Tabbar activeColor='rgb(111,118,251)'>
                <Tabbar.Item icon={<MyIcon name='icon-emptybox' />} onClick={()=>navigate('/home')}>首页</Tabbar.Item>
                <Tabbar.Item icon={<MyIcon name='icon-xuanfuanniufadongtai' />} onClick={()=>navigate('/dynamic')}>动态</Tabbar.Item>
                <Tabbar.Item icon={<MyIcon name='icon-xingqiu1' fontSize={50}/>}></Tabbar.Item>
                <Tabbar.Item icon={<MyIcon name='icon-sousuo2' />}>搜索</Tabbar.Item>
                <Tabbar.Item icon={<MyIcon name='icon-wode' />}>我的</Tabbar.Item>
            </Tabbar>
        </div>
    )
}
